/*
 * macms.menu.js
 * 用于装载菜单树
 */

var menutree = [
	{
		"title" : "风控业务监控",
		"url" : "",
		"id": "1",
		"childs":[
            {
                "title" : "规则服务日志",
                "url" : "page/rsp-conosle/BizRuleLogList.html",
                "id": "11"
            }
		],
	},{
        "title" : "风控业务适配",
        "url" : "",
        "id": "2",
        "childs":[
            {
                "title" : "业务规则适配",
                "url" : "page/rsp-conosle/BizRuleAdapterList.html",
                "id": "21"
            }
        ],
    },{
        "title" : "规则配置",
        "url" : "",
        "id": "3",
        "childs":[
            {
                "title" : "规则配置",
                "url" : "page/rsp-conosle/SRuleInfoList.html",
                "id": "31"
            },{
                "title" : "规则集信息",
                "url" : "page/rsp-conosle/SRuleCollInfoList.html",
                "id": "32"
            }
        ],
    },{
        "title" : "系统管理",
        "url" : "",
        "id": "4",
        "childs":[
            {
                "title" : "系统字典信息",
                "url" : "page/admin/SDicList.html",
                "id": "41"
            }
        ],
    }
];
/* 当前一级菜单ID */
var curFirstLevelMenuId = "";

/* 
 * 根据指定的一级菜单标识显示子菜单信息在导航栏
 * 如果已经生成了一级菜单的子菜单，则直接显示,否则生成 
 */
function showTreeMenuBar(firstLevelMenuId){
	if(curFirstLevelMenuId == ""){
		$('#' + firstLevelMenuId ).show();
		curFirstLevelMenuId = firstLevelMenuId;
	} else {
		if(curFirstLevelMenuId == firstLevelMenuId)
			return;
		$('#' + curFirstLevelMenuId).hide();
		$('#' + firstLevelMenuId ).show();
		curFirstLevelMenuId = firstLevelMenuId;
	}
}
/*
 * 生成一级菜单下的子菜单信息(默认展开)
 */
function generateTreeMenuBar(firstLevelMenuId){
	
	
}

/**
 * 创建菜单的html, 最多支持三级菜单
 * @param element
 * @param menutree
 * @param isBoard   是否是平辅式菜单
 */
function createMenu(element, menutree, isBoard) {
    var content = [];
    for (var i=0; i<menutree.length; i++) {
        var menu = menutree[i];
        var hasChild = (menu.childs && menu.childs.length > 0); // 有子菜单
        var menuDom = $('<div class="menu-dropdown"></div>');
        menuDom.attr('menu-id', menu.id);
        var menuBtn = $('<button class="menu-dropbtn">' + menu.title + '<i class="el el-caret-left"></i></button>');
        menuDom.append(menuBtn);
        if (hasChild) {
            var subMenuDom = $('<div class="menu-dropdown-content menu-dropdown-content-hidden"></div>');
            if (isBoard) {
                subMenuDom.addClass("menu-dropdown-content-board");
            }
            for (var j=0; j<menu.childs.length; j++) {
                var child = menu.childs[j];
                var hasThird = (child.childs && child.childs.length > 0);
                if (hasThird) {
                    var thirdDom = $('<div class="menu-dropdown-content-sub"></div>');
                    var thirdADom = $('<a href="#">'+child.title+ (isBoard ? '' : '<i class="el el-caret-right">') + '</a>');
                    thirdADom.attr('menu-id', child.id);
                    if (child.url) {
                        thirdADom.attr("onclick","javascript:addTab($(this).text(),'"+child.url+"')");
                    }
                    thirdDom.append(thirdADom);
                    var ulDom = $('<ul></ul>');
                    thirdDom.append(ulDom);
                    for (var k=0; k<child.childs.length; k++) {
                        var thirdChild = child.childs[k];
                        var liDom = $('<li></li>');
                        var thirdADom = $('<a href="#">'+thirdChild.title+'</a>');
                        thirdADom.attr('menu-id', thirdChild.id);
                        thirdADom.attr("onclick","javascript:addTab($(this).text(),'"+thirdChild.url+"')");
                        liDom.append(thirdADom);
                        ulDom.append(liDom);
                    }
                    subMenuDom.append(thirdDom);
                } else {
                    var aDom = $('<a href="#">'+child.title+'</a>');
                    aDom.attr('menu-id', child.id);
                    aDom.attr("onclick","javascript:addTab($(this).text(),'"+child.url+"')");
                    subMenuDom.append(aDom)
                }
            }
            menuDom.append(subMenuDom);
        } else {
            menuBtn.attr("onclick","javascript:addTab($(this).text(),'"+menu.url+"')");
        }
        content.push(menuDom);
    }
    if (content.length > 0) {
        $(element).append(content);
    }
}

/**
 * 创建平辅样式的菜单下拉
 * @param element
 * @param menutree
 */
function createMenuBoard(element, menutree) {
    createMenu(element, menutree, true);
}

/**
 * 树状菜单dom创建
 * @param element
 * @param menutree
 */
function createMenuTree(element, menutree) {
    createMenu(element, menutree, false);
}

function generateMenuTree(element) {
    // 隐藏显示动画时间
    var TIME_TO_SHOW = 200;
    // 菜单显示 class 标识
    var SUB_HOVER_CLASS = "menu-sub-show";
    // 处理菜单显示打标识
    var hoverOnSub = function(event){
        $(this).addClass(SUB_HOVER_CLASS);
        event.preventDefault();
    };
    // 处理菜单隐藏
    var hoverOffSub = function(event, flag){
        var self = $(this);
        self.removeClass(SUB_HOVER_CLASS);
        self.delay(TIME_TO_SHOW).slideUp(TIME_TO_SHOW);
        event.preventDefault();
    };
    // 三级菜单显示处理
    function handleThirdMenuShow(event) {
        var offset = $(event.target).position();
        var width = $(event.target).outerWidth();
        console.log(offset, width);
        var targetUl = $(event.target).siblings("ul");
        $(targetUl).css("top", 0).css("left", 0).css("position", "absolute");
        $(targetUl).offset({top : offset.top,  left: offset.left + width}).delay(TIME_TO_SHOW).show();
        // $(targetUl).delay(TIME_TO_SHOW).show();
        event.preventDefault();
    }
    // 三级菜单隐藏处理
    function handleThirdMenuHide(event) {
        var targetUl = $(event.target).siblings("ul");
        $(targetUl).delay(TIME_TO_SHOW).hide();
        event.preventDefault();
    }
    // 处理菜单事件绑定与浮动dom生成
    var showMenu = function(inevent){
        var menuContent = $(this).find("div.menu-dropdown-content");
        var menuInstance = $(menuContent).data("menu-dropdown");
        var parentOffset = $(this).offset();
        var parentHeight = $(this).outerHeight();
        if (menuInstance) {
            $(menuInstance).css("top", 0).css("left", 0);
            $(menuInstance).offset({top: parentOffset.top + parentHeight, left: parentOffset.left}).slideDown(TIME_TO_SHOW);
            return;
        } else {
            var container = $('<div class="menu-popup"></div>');
            $('body').append(container);
            $(menuContent).clone().removeClass("menu-dropdown-content-hidden").appendTo(container);
            $(container).offset({top: parentOffset.top + parentHeight, left: parentOffset.left}).slideDown(TIME_TO_SHOW);
            $(menuContent).data("menu-dropdown", container);
            $(container).hover(hoverOnSub, hoverOffSub);
            $(container).find("div.menu-dropdown-content-sub").hover(handleThirdMenuShow, handleThirdMenuHide);
        }
    };
    // 处理菜单失去鼠标焦点时，是否隐藏下拉菜单
    var handleMenuHide = function(outevent){
        var menuDropdown = $(outevent.target);
        while (!menuDropdown.hasClass("menu-dropdown")) {
            if (outevent.target.tagName == "A" || outevent.target.tagName == "a") {
                break;
            }
            menuDropdown = menuDropdown.parents(".menu-dropdown");
        }
        var menuContent = menuDropdown.find("div.menu-dropdown-content");
        var menuInstance = $(menuContent).data("menu-dropdown");
        if (!menuInstance) {
            menuDropdown = $(menuDropdown).parents(".menu-dropdown");
            menuContent = menuDropdown.find("div.menu-dropdown-content");
            menuInstance = $(menuContent).data("menu-dropdown");
        }
        var onSubMenu = menuInstance.hasClass(SUB_HOVER_CLASS);
        if (!onSubMenu) {
            menuInstance.slideUp(TIME_TO_SHOW);
        }

    };
    // 菜单失去鼠标时事件处理
    var hideMenu = function(outevent){
        setTimeout(function(){
            handleMenuHide(outevent);
        }, TIME_TO_SHOW);
        outevent.preventDefault();
    };
    // 绑定事件处理
    createMenuTree(element, menutree);
    $(element + ' div.menu-dropdown').delay(TIME_TO_SHOW).hover(showMenu, hideMenu);
}

function generateMenuBoard(element) {
    // 隐藏显示动画时间
    var TIME_TO_SHOW = 200;
    // 菜单显示 class 标识
    var SUB_HOVER_CLASS = "menu-sub-show";
    // 处理菜单显示打标识
    var hoverOnSub = function(event){
        $(this).addClass(SUB_HOVER_CLASS);
        event.preventDefault();
    };
    // 处理菜单隐藏
    var hoverOffSub = function(event, flag){
        var self = $(this);
        self.removeClass(SUB_HOVER_CLASS);
        self.delay(TIME_TO_SHOW).slideUp(TIME_TO_SHOW);
        event.preventDefault();
    };

    // 处理菜单事件绑定与浮动dom生成
    var showMenu = function(inevent){
        var menuContent = $(this).find("div.menu-dropdown-content");
        var menuInstance = $(menuContent).data("menu-dropdown");
        var parentOffset = $(this).offset();
        var parentHeight = $(this).outerHeight();
        if (menuInstance) {
            $(menuInstance).css("top", 0).css("left", 0);
            $(menuInstance).offset({top: parentOffset.top + parentHeight, left: parentOffset.left}).slideDown(TIME_TO_SHOW);
            return;
        } else {
            var container = $('<div class="menu-popup"></div>');
            $('body').append(container);
            $(menuContent).clone().removeClass("menu-dropdown-content-hidden").appendTo(container);
            $(container).offset({top: parentOffset.top + parentHeight, left: parentOffset.left}).slideDown(TIME_TO_SHOW);
            $(menuContent).data("menu-dropdown", container);
            $(container).hover(hoverOnSub, hoverOffSub);
        }
    };
    // 处理菜单失去鼠标焦点时，是否隐藏下拉菜单
    var handleMenuHide = function(outevent){
        var menuDropdown = $(outevent.target);
        while (!menuDropdown.hasClass("menu-dropdown")) {
            if (outevent.target.tagName == "A" || outevent.target.tagName == "a") {
                break;
            }
            menuDropdown = menuDropdown.parents(".menu-dropdown");
        }
        var menuContent = menuDropdown.find("div.menu-dropdown-content");
        var menuInstance = $(menuContent).data("menu-dropdown");
        if (!menuInstance) {
            menuDropdown = $(menuDropdown).parents(".menu-dropdown");
            menuContent = menuDropdown.find("div.menu-dropdown-content");
            menuInstance = $(menuContent).data("menu-dropdown");
        }
        var onSubMenu = menuInstance.hasClass(SUB_HOVER_CLASS);
        if (!onSubMenu) {
            menuInstance.slideUp(TIME_TO_SHOW);
        }
    };
    // 菜单失去鼠标时事件处理
    var hideMenu = function(outevent){
        setTimeout(function(){
            handleMenuHide(outevent);
        }, TIME_TO_SHOW);
        outevent.preventDefault();
    };
    // 绑定事件处理
    createMenuBoard(element, menutree);
    $(element + ' div.menu-dropdown').delay(TIME_TO_SHOW).hover(showMenu, hideMenu);
}

function generateMenu(element, type) {
    if (type == 'tree') {
        generateMenuTree(element);
    } else if (type == 'board') {
        generateMenuBoard(element);
    }
}